<template>
	<view class="contain  f-c f-j-s">
			<view class="padding-15">
				<view class=" flex fixed-top h-44 box-c"  :style="{'padding-top': top + 'px'}">
					<view @click="back(1)"  class="flex f-s-0 padding-lr10 f-a-c f-j-c van-icon van-icon-arrow-left f20-size"></view>
				</view>
				<!-- #ifndef H5 -->
				<view :style="{'padding-top': top+30+'px'}"></view>
				<!-- #endif -->

			<view class="padding-20"></view>
			<view class="padding-6"></view>
			<view class="padding-lr12">
				<view class="f20-size f-w-b">{{i18n['修改登录密码']}}</view>
				<view class="padding-tb6"></view>
				<view class="flex h-50 b-radius-30 bg-color-f1 margin-t8">
					<view class="flex  f-a-c f-j-c f-s-0 icon-item f-w-b">+86</view>
					<view class="flex flex-1 padding-lr12">
						<input class="f16-size" v-model="phone"   type="tel" maxlength="11" :placeholder="i18n['请输入手机号码']">
					</view>
				</view>
				<view class="flex h-50 b-radius-30 bg-color-f1 margin-t8">
					<view class="flex  f-a-c f-j-c f-s-0 icon-item f-w-b">
						<image class="w-20" src="@/static/images/login_passport.png" mode="widthFix"></image>
					</view>
					<view class="flex flex-1 padding-lr12">
						<input class="f16-size" v-model="password" type="password" :placeholder="i18n['请输入新登录密码']">
					</view>
				</view>
				<view class="flex h-50 b-radius-30 bg-color-f1 margin-t8">
					<view class="flex  f-a-c f-j-c f-s-0 icon-item f-w-b">
						<image class="w-20" src="@/static/images/login_passport.png" mode="widthFix"></image>
					</view>
					<view class="flex flex-1 padding-lr12">
						<input class="f16-size" v-model="comfirmPassword" type="password" :placeholder="i18n['请输入确认新密码']">
					</view>
				</view>
				<view class="flex h-50 b-radius-30 bg-color-f1 margin-t8 over-h">
					<view class="flex  f-a-c f-j-c f-s-0 icon-item f-w-b">
						<image class="w-20" src="@/static/images/login_code.png" mode="widthFix"></image>
					</view>
					<view class="flex flex-1 padding-lr12">
						<input class="f16-size" v-model="code" type="tel" :placeholder="i18n['请输入验证码']">
					</view>
					<view class="flex f-a-c f-s-0">
						<img-code ref="imgCode" @imgSuc="getImgCode" class="flex  h-30"></img-code>
					</view>
				</view>
				<view class="flex h-50 b-radius-30 bg-color-f1 margin-t8">
					<view class="flex  f-a-c f-j-c f-s-0 icon-item f-w-b">
						<image class="w-20" src="@/static/images/login_code.png" mode="widthFix"></image>
					</view>
					<view class="flex flex-1 padding-lr12">
						<input class="f16-size" v-model="sms" type="tel" :placeholder="i18n['请输入验证码']">
					</view>
					<view class="padding-6">
						<phone-code :phone="phone" :code="code" :codeImg="codeImg" :sendType="3"  ></phone-code>
					</view>
				</view>
				<view @click="changePay" class="flex f-a-c f-j-c b-radius-30 h-44 bg-color-linear-y t-color-w f-w-500 margin-t20">{{i18n['确定修改']}}</view>
				<view class="flex f-j-s ">
					<view @click="go('/pages/user/passport/login',2)" class="f14-size  padding-tb20">{{i18n['密码登录']}}</view>
					<view @click="go('/pages/user/passport/register',2)" class="flex f-a-c">
						<text class="f14-size ">{{i18n['注册']}}</text>
					</view>
				</view>
			</view>
		</view>
		<view class=" safe-area" :style="isIphonex ? 'padding-bottom:34px;' : ''">
			<view  class="flex f-a-c ">
				<view class="padding-6"></view>
				<text @click="isAgree = !isAgree"  :class="isAgree ? 'van-icon-checked t-color-y' : 'van-icon-circle t-color-b'" class="flex f-a-c f-j-c van-icon  f16-size margin-r4"></text>
				<text @click="isAgree = !isAgree"  class="margin-r4 flex f-s-0">{{i18n['已阅读并同意']}}</text>
				<text @click="go('/pages/user/rules?type=1')" class="t-color-blue1 margin-r4  flex f-s-0">《{{i18n['用户协议']}}》</text>
				<text @click="go('/pages/user/rules?type=2')" class="t-color-blue1  flex f-s-0">《{{i18n['隐私政策']}}》</text>
			</view>
			<view class="padding-6"></view>
			<xieyi ref='xieyi' @agree="agree"></xieyi>
		</view>
	</view>
</template>
<script>
	import xieyi from '@/components/common/xieyi.vue';
	import imgCode from '@/components/common/imgcode.vue';
	import phoneCode from '@/components/common/phonecode.vue';
	const $ = require('@/utils/api.js');
	const api = require('@/utils/validate.js');
	export default {
		data() {
			return {


				user: '',
				// surePassword: '',
				// password: '',
				// code: '',
				// sms: '',
				// codeText: '',
				// smsTxt: '获取验证码',


				top: uni.getStorageSync('bartop') ? uni.getStorageSync('bartop') : 0,
				isIphonex: uni.getStorageSync('isIphonex') ? uni.getStorageSync('isIphonex') : false,
				phone: '',
				password: '',
				comfirmPassword: '',
				isAgree: false,
				sms: '',
				code: '',
				codeInfo:{},
				codeImg: '',
			};
		},
		onLoad: function() {
			this.init();
		},
		methods: {



			getImgCode(info) {
				this.codeInfo = info;
			},
			changePay() {
				const self = this;
				if(!self.isAgree) {
					$.$toast(self.i18n['请阅读并同意用户协议']);return;
				}
				let check = api.validate([
					{
						value: this.phone,
						text:self.i18n['请输入手机号码'],
						rules: 'phone'
					},
					{
						value: this.password,
						text:self.i18n['请输入新登录密码'],
						rules: ''
					},
					{
						value: this.comfirmPassword,
						text:self.i18n['请输入确认新密码'],
						rules: ''
					},
					{
						value: this.sms,
						text:self.i18n['请输入验证码'],
						rules: ''
					}
				]);
				if(!check){return};
				$.ajax({
					url: 'member/setPassword',
					data: {
						phone: this.phone,
						password: this.password,
						comfirmPassword: this.comfirmPassword,
					    code: this.sms,
						cToken: this.codeInfo.cToken,
						captcha: this.code,
					},
					method: 'POST',
					success(res) {
						$.$toast(self.i18n['操作成功']);
						$.go('/pages/home/index',3,2000);
					},
					fail(res) {
						$.$toast(self.i18n['操作失败']);
						// $.go('/pages/home/index',3,2000);
					}
				})
			},
			// setPassword() {
			// 	const self = this;
			// 	$.ajax({
			// 		url: 'member/setPassword',
			// 		data: {
			// 			password: self.password,
			// 			comfirmPassword: self.comfirmPassword,
			// 		},
			// 		method: 'POST',
			// 		success(res) {
			// 			$.$toast(self.i18n['操作成功']);
			// 			$.go('/pages/home/index',3,2000);
			// 		}
			// 	})
			// },
			init() {
					this.user = uni.getStorageSync('userInfo');
					this.phone = this.user.phone
			},


		},
		computed: {
			i18n() {
				return this.$t('login')
			},
		},
		created() {
		},
		mounted() {},
		destroyed() {},
		components: {phoneCode,imgCode,xieyi},
		onPullDownRefresh() {
		},
		onReachBottom() {
		}
	}
</script>
<style scoped>
	@import url('@/static/css/passport/login.css');
	@import url('@/static/css/page/white.css');
</style>
